<template>
    <div >
        <el-row >
            <el-col >
                <el-card style="margin-top: -19px;width:80%;margin-left: 130px" >
                    <h3 style="text-align: center;margin-top: -2px">如何写好一篇博客</h3>
                    <div style="margin-top: 10px;text-align: center">

                        <p><span style="font-weight: bold">加粗-</span>文章段落中可以使用粗体和其他格式来强调重点</p>

                        <p><span style="font-weight: bold">小标题和副标题-</span>在文章中间使用标题能帮助建立清晰的文章结构</p>
                        <p style=""> <span style="font-weight: bold">列表-</span>文章在排版时使用列表，可以给人简洁有序的感觉，带有符合和编号的给人的感觉更清晰</p>



                        <p><span style="font-weight: bold">文章标题-</span>  一个好的文章，标题对文章阅读有着至关重要的作用 ，所以标题一定需要仔细推敲,精彩有趣的文章</p>
                        <p> <span style="font-weight: bold"> 文章内容-</span>先把文章排版和标题做好，内容方面可以慢慢积累,把博客文章写作的门面和框架处理好才是博客文章写作的基础。</p>
                        <p><span style="font-weight: bold">简短的段落-</span> 阅读长篇的文章很容易迷失方向。把大段的文章分散成成更容易接受的小段落，你将发现用户会花更多时间阅读你的文章。</p>

                    </div></el-card>
            </el-col>
        </el-row>


        <div style="width: 60%;margin-left: 250px;margin-top: 43px">
            <el-carousel :interval="5000" arrow="always">
                <el-carousel-item v-for="item in imgs" :key="item">
                    <img style="height: 300px;width: 100%" :src="item"/>
                </el-carousel-item>
            </el-carousel>

        </div>



    </div>
</template>

<script>
// import request from  '../utils/request'
    export default {
        name: 'Dashboard',
        data() {
            return {
                form: {},
                imgs: [
                    'https://tva1.sinaimg.cn/large/466f79e8ly1gzb0wu6hjaj21hc0u0jv4.jpg',
                    'https://tva1.sinaimg.cn/large/466f79e8ly1gzb0ww55ugj21hc0u0k1a.jpg',
                    'https://tva1.sinaimg.cn/large/466f79e8ly1gzb0wunxqyj21hc0u0k23.jpg',
                    'https://tva1.sinaimg.cn/large/466f79e8ly1gzb0ww4kwpj21hc0u0ahg.jpg',
                    'https://tva1.sinaimg.cn/large/466f79e8ly1gzb0wx2adwj21hc0u0dnq.jpg'
                ]
            }
        },
        created() {
         /*  request.get('https://api.dujin.org/pic/fengjing').then(res=>{
                console.log(res)
            })*/

        }

    }
</script>


<style>
    .el-carousel__item h3 {
        color: #475669;
        font-size: 18px;
        opacity: 0.75;
        line-height: 300px;
        margin: 0;
    }

    .el-carousel__item:nth-child(2n) {
        background-color: #99a9bf;
    }

    .el-carousel__item:nth-child(2n+1) {
        background-color: #d3dce6;
    }

    #main {
        width: 400px;
        height: 400px;

        margin-top: 10px
    }

    .line-wrap {
        width: 200px;
        height: 400px;
    }
</style>
